<template>
    <el-main>
       <div>
     <!-- <input type="text" v-model="key" placeholder="请输入订单" height=""> -->
     <el-input type="text" v-model="key" placeholder="请输入订单服务内容" style="width:300px"></el-input>
     <!-- <input type="button" value="搜索" @click="find()"><br><br> -->
     <el-button type="info"  @click="find()">搜索</el-button><br><br>
      <el-button type="info" @click="reload()">返回</el-button>&nbsp;&nbsp;&nbsp;&nbsp; 
     <el-button type="primary"  @click="tosolved()">查看已处理订单</el-button><br>
     
        <el-table
        ref="multipletable"
        tooltip-effect="dark"
        @selection-change="handleselectionchange"
      :data="tableData"
       height="450"
      border
      style="width: auto">
        <el-table-column
       type="selection"
        width="50"
        align="center">
      </el-table-column>
      <el-table-column
        prop="content"
        label="服务内容"
        width="200"
        align="center">
      </el-table-column>
      <el-table-column
        prop="appointmentTime"
        label="服务时间"
        width="200"
        align="center">
      </el-table-column>
        <el-table-column
        prop="appointmentAddress"
        label="服务地点"
        width="200"
        align="center">
      </el-table-column>
        <el-table-column
        prop="contactmethod"
        label="联系方式"
        width="200"
        align="center">
      </el-table-column>
        <el-table-column
        prop="price"
        label="服务价格"
        width="80"
        align="center">
      </el-table-column>
      <el-table-column     
        label="操作"
        align="center"
        width="250">
        
        <template slot-scope="scope"> 
          <!-- type里的选项只是颜色 -->
          <!-- 这些方法用于打开对话框，名字要和真正实现的方法，事件名区分 -->
          <el-button type="success" size="mini" @click="info(scope)">查看</el-button>
          <el-button type="warning" size="mini"  @click="accept(scope)">接单</el-button>
          <el-button type="primary" size="mini"  @click="updateprice(scope)">改价</el-button>
           
        </template>
      </el-table-column>
    </el-table>
    <el-button @click="acceptmultipledata()">批量接单</el-button>
        <!-- 详情对话框 -->
        <el-dialog
      title="详情"
      :visible.sync="dialogVisible"
      width="50%">
     <detail :current="current" @close="close" ></detail>
    </el-dialog>

        <el-dialog
      title="修改价格"
      :visible.sync="dialogVisible2"
       align="center"
      width="40%">
      <div>
        <!-- <input type="number" v-model="newprice"> -->
        <el-input type="number" v-model="newprice" style="width:150px"></el-input><br><br>
      </div>
    <el-button type="primary" @click="confirmprice()">确 定</el-button>
    <el-button type="primary" @click="cancel()">取消</el-button>
    </el-dialog>

    </div>
    </el-main>
   
</template>
<script>
import detail from './Merchantorderdetail.vue'
export default {
           data() {
           return{
           tableData:[], 
           key:"",
             serviceOrder:{
            id:"",
            uid:"",
            cid:"",
            iid:"",
            content:"",
            appointmentTime:"",
            aoopintmnetAddress:"",
            status:"",
            price:"",
            community:"",
            
           },
            current:{},
            dialogVisible:false,
            // 多选
            multipleselection:[],
            //返回数组
            multiplearr:[],
            // 改价用的
            dialogVisible2:false,
            orderid:"",
            newprice:""

      }
    },
    methods:{
        tosolved:function(){
             this.$router.push("merchantorder")
        },
      //批量接单
      acceptmultipledata:function(){
        let val=this.multipleselection
         if(val){
            for(var i=0;i<val.length;i++){
                this.multiplearr.push(val[i].id)
            }
            // alert(this.multiplearr)
            // alert(this.multiplearr.length)
          this.$axios.post("http://localhost:8080/merchant/multipleacceptorder",this.multiplearr).then(res=>{
           if(res.data.status=="SUCCESS"){
            this.$axios.get("http://localhost:8080/merchant/unsolvedorder/"+JSON.parse(window.sessionStorage.getItem("user")).id).then(res =>{
          console.log("批量删除")
          console.log(res.data)//ResponseResult
          console.log(res.data.data)  
        this.tableData = res.data.data
        
      })
           }
          })
        }
          //清除选中状态
        this.$refs.multipletable.clearSelection()


      },
      //得到选中数据
      handleselectionchange:function(val){
        this.multipleselection=val
      },
       //查看详情
      info:function(scope){
        // scope.$index  获取当前第几个元素被点击了
        // scope.row 获取当前行的数据
        console.log(scope.row)
        this.current = scope.row       
        // 显示对话框
        this.dialogVisible = true
      },
          close:function(){
         this.dialogVisible = false
      },
      // 搜索
      find:function(){
        // alert(this.key)
      this.$axios.get("http://localhost:8080/merchant/findorderbycontent0/"+this.key).then(res=>{
        if(res.data.status=="SUCCESS"){
          console.log("开心，查到了")
          this.tableData=res.data.data
          // this.tableData=JSON.parse(JSON.stringify(this.tableData))  

        }else{
          alert("没找到相关订单")
        }
      })
      },
      //单独接单
      accept:function(scope){
        this.serviceOrder=scope.row     
            this.$axios.post("http://localhost:8080/merchant/acceptorder",this.serviceOrder).then(res =>{
      if(res.data.status=="SUCCESS"){
      this.tableData.splice(scope.$index,1)
         }
        
      })
      },
      // 改价窗口
      updateprice:function(scope){
        this.dialogVisible2=true
        this.orderid=scope.row.id
      },
      cancel:function(){
        this.dialogVisible2=false
      },
      confirmprice:function(){
      this.serviceOrder.id=this.orderid
      this.serviceOrder.price=this.newprice
        this.$axios.post("http://localhost:8080/merchant/updateprice", this.serviceOrder).then(res =>{
          if(res.data.status=="SUCCESS"){
          console.log("修改价格成功")
          // 重新加载
          this.$axios.get("http://localhost:8080/merchant/unsolvedorder/"+JSON.parse(window.sessionStorage.getItem("user")).id).then(res =>{

        this.tableData = res.data.data
        
      })

        }
        this.dialogVisible2=false
      })
      },
      reload:function(){
       this.$axios.get("http://localhost:8080/merchant/unsolvedorder/"+JSON.parse(window.sessionStorage.getItem("user")).id).then(res =>{
        console.log("重新加载") 
        this.tableData = res.data.data
        
      })
      }
    },
      components:{
      detail,
    },
    mounted(){
        console.log("用户信息："+JSON.parse(window.sessionStorage.getItem("user")))
        console.log("用户id："+JSON.parse(window.sessionStorage.getItem("user")).id)
        //后台用session获取id更简单
        this.$axios.get("http://localhost:8080/merchant/unsolvedorder/"+JSON.parse(window.sessionStorage.getItem("user")).id).then(res =>{
         console.log(res.data)//ResponseResult
        console.log(res.data.data)  
        this.tableData = res.data.data
        
      })
    }
}
</script>
<style>
</style>